<template>
    <table border="1">
        <tr>
            <td colspan="2" style="text-align:center;;font-size:30px;">折扣券添加</td>
        </tr>
        <tr>
            <td>折扣券标题</td>
            <td>
                <input type="text" v-model="Info.Discount_Tittel"/>
            </td>
        </tr>
        <tr>
            <td>折扣券颜色</td>
            <td>
                <input type="text" v-model="Info.Discount_Color"/>
            </td>
        </tr>
        <tr>
            <td>折扣券图片</td>
            <td>
                <img style="width:70px;height:80px;" :src="Info.Discount_Img"/>
                <input type="file" @change="UpLoad"/>
            </td>
        </tr>
        <tr>
            <td>剩余库存余量</td>
            <td>
                <input type="text" v-model="Info.Discount_Num"/>
            </td>
        </tr>
        <tr>
            <td>每人限领</td>
            <td>
                <input type="text" v-model="Info.Discount_Limited"/>
            </td>
        </tr>
        <tr>
            <td>使用条件</td>
            <td>
                <input type="text" v-model="Info.Discount_Use"/>
            </td>
        </tr>
        <tr>
            <td>折扣</td>
            <td>
                <input type="text" v-model="Info.Discount_Discount"/>
            </td>
        </tr>
        <tr>
            <td>开始日期</td>
            <td>
                <input type="date" v-model="Info.Discount_StartTime"/>
            </td>
        </tr>
        <tr>
            <td>截止日期</td>
            <td>
                <input type="date" v-model="Info.Discount_EndTime"/>
            </td>
        </tr>
        <tr>
            <td>适用业务</td>
            <td>
                <input type="text" v-model="Info.Discount_Business"/>
            </td>
        </tr>
        <tr>
            <td>使用须知</td>
            <td>
                <input type="text" v-model="Info.Discount_Precautions"/>
            </td>
        </tr>
        <tr>
            <td>客服电话</td>
            <td>
                <input type="text" v-model="Info.Discount_Phone"/>
            </td>
        </tr>
        <tr>
            <td colspan="2" style="text-align:center;">
                <input type="button" value="添加" @click="addDiscount"/>
            </td>
        </tr>
    </table>
</template>

<script setup lang="ts">
import {ref} from 'vue'
import axios from 'axios'
import {useRouter} from 'vue-router'


const router=useRouter();

const Info=ref({
    Discount_Id:0,
    Discount_Tittel:"",
    Discount_Color:"",
    Discount_Num:"",
    Discount_Limited:"",
    Discount_Use:"",
    Discount_Discount:"",
    Discount_StartTime:"",
    Discount_EndTime:"",
    Discount_Business:"",
    Discount_Img:"",
    Discount_Precautions:"",
    Discount_Phone:"",
    Shop_Id:0
})

//图片上传
const UpLoad=(e:any)=>{
    //获取文件对象
    var file=e.target.files[0];
    //创建表单数据对象
    var fd=new FormData();
    //将文件对象保存到表单数据中心
    fd.append("Img",file);
    axios.post("https://localhost:7153/api/Files/FileUpload",fd)
    .then(res=>{
        Info.value.Discount_Img=res.data;
    })
    .catch(err=>{
        console.log(err);
    })
}

//保存数据
const addDiscount=()=>{
    axios.post("https://localhost:7153/api/Member/AddDiscount/AddDiscount",Info.value)
    .then(res=>{
        if(res.data>0)
        {
            alert("添加成功");
            router.push("/ShowDiscount");
        }
        else{
            alert("添加失败");
        }
    })
}
</script>